<script setup lang="ts">
import { onMounted } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { useLogin } from './index'
import { useUserStore } from '@/stores/user'
import LoginInput from '@/components/LoginInput.vue'
import LoginButton from '@/components/LoginButton.vue'

// 使用登录逻辑
const {
  form,
  loading,
  logoImage,
  beforeLogin,
  handleWechatLogin,
} = useLogin()

const userStore = useUserStore()
const userInfo = userStore.userInfo

onLoad((res) => {
  // 处理页面参数
  if (res?.phoneNumber) {
    form.username = res.phoneNumber
  }
  if (res?.password) {
    form.password = res.password
  }
  console.log(res)

  // 处理登录过期信息
  if (res?.expire) {
    if (res.expire === '0') {
      uni.showToast({
        icon: 'error',
        position: 'bottom',
        title: '登录过期...',
      })
    }
  }
})

onMounted(() => {
  checkLoginStatus()
})

// 检查登录状态
function checkLoginStatus() {
  try {
    if (userStore.isLoggedIn) {
      console.log('已登录用户：', userInfo?.username)

      // 如果已登录且不是因为过期跳转过来的，直接跳转到首页
      const pages = getCurrentPages()
      const currentPage = pages[pages.length - 1] as any
      const isExpired = currentPage?.options?.expire === '0'

      if (!isExpired) {
        uni.switchTab({
          url: '/pages/home/index',
        })
      }
    }
  }
  catch (e) {
    console.error('检查登录状态失败:', e)
  }
}

// 第三方登录方法
function loginWeixin() {
  handleWechatLogin()
}

function loginPhone() {
  uni.navigateTo({
    url: '/pages/login/phone/index',
  })
}

function handleForgotPassword() {
  uni.navigateTo({
    url: '/pages/login/forgot/index',
  })
}

// 更新logo图片地址
logoImage.value = 'https://img.zwfcyy.top/echo-app/logo/er-main.png'
</script>

<template>
  <view class="login">
    <view class="content" style="padding-bottom: env(safe-area-inset-bottom)">
      <!-- 头部logo -->
      <view class="header">
        <image :src="logoImage" />
      </view>
      <!-- 主体表单 -->
      <view class="main">
        <LoginInput
          v-model="form.username"
          type="text"
          maxlength="11"
          placeholder="用户名/手机号码"
          :focus="true"
        />
        <LoginInput
          v-model="form.password"
          type="password"
          maxlength="20"
          placeholder="密码"
        />
      </view>
      <LoginButton
        class="my-button"
        text="登 录"
        :rotate="loading"
        @click="beforeLogin"
      />

      <!-- 其他登录 -->
      <view class="other_login">
        <view class="other_login_text">
          其他登录方式
        </view>
        <view class="login_icons">
          <view class="login_icon" @tap="loginWeixin">
            <image
              src="https://img.zwfcyy.top/echo-app/icon/svg/wechat.svg"
              class="login_icon_image"
              mode="aspectFit"
            />
          </view>
          <view class="login_icon" @tap="loginPhone">
            <image
              src="https://img.zwfcyy.top/echo-app/icon/svg/phone.svg"
              class="login_icon_image"
              mode="aspectFit"
            />
          </view>
          <view class="login_icon" @tap="handleForgotPassword">
            <image
              src="https://img.zwfcyy.top/echo-app/icon/svg/forgetpwd.svg"
              class="login_icon_image"
              mode="aspectFit"
            />
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
@import "./index.scss";
</style>
